<template>
  <view class="VideoList">
    <view class="swiper-box">
      <swiper class="swiper" :duration="500" vertical @change="itemChange" @animationfinish="animationfinish">
        <swiper-item v-for="(item,index) in videoList" :key="item.data.vid">
          <view class="swiper-item"><video-player :videoInfo="item" :index="index" ref="playerItem"></video-player></view>
        </swiper-item>
      </swiper>
    </view>
  </view>
</template>

<script>
import VideoPlayer from './VideoPlayer.vue'
export default {
  name: 'VideoList',
  components: { VideoPlayer },
  props: {
    videoList: {
      type: Array,
      default() {
        return []
      }
    }
  },
  methods: {
    itemChange() {
      if (Object.keys(getApp().globalData.globalVideoPlay).length)
        getApp().globalData.globalVideoPlay.stop()
    },
    animationfinish(e){
      this.$refs.playerItem[e.detail.current].PlayVideo('swich')
    }
  },
  data() {
    return {}
  },

}
</script>

<style lang="scss" scoped>
.swiper,
.swiper-item {
  height: 100vh;
}
</style>
